<script setup lang="ts">
import { useRouter } from "vue-router";
import { Tracker, Oauth } from "cyq-common";
import { routes } from "../../route";
import { ref } from "vue";

new Tracker({ data: { name: "小红", age: "19" } });
const props = ref("");
const show = () => {
  props.value = JSON.stringify(window.$wujie.props);
};

const tgLogin = () => {
  Oauth.TG.login()
}

// 发送事件给父应用
const senMsg = () => {
  window.$wujie?.bus.$emit("onSubAppProps", "vue", 18);
};
// 接收父应用事件
window.$wujie?.bus.$on("onReport", function (name: string, age: number) {
  console.log("我是vue 监听来自父应用事件", name, age);
});
defineProps({
  msg: String,
});
const router = useRouter();

const toPage = (name) => {
  router.push(name + "/");
};
</script>

<template>
  <button @click="tgLogin">电报登陆</button>
  <button @click="show">点我显示主应用传递参数{{ props }}</button>
  <button @click="senMsg">发送事件给父应用</button>
  <HelloWorld msg="Vite + Vue" />
  <div class="button-box">
    <button class="" v-for="item in routes" @click="toPage(item.path)">
      {{ item.name }}
    </button>
  </div>
</template>

<style scoped>
.button-box {
  display: flex;
  flex-direction: row;

  >button {
    margin-left: 10px;
    margin-top: 10px;
  }
}
</style>
